<template>

    <div class="M_editor">
        <el-input v-model="choicestitle" placeholder="请输入文章标题" size="large"></el-input>
        <el-input v-model="chiocedescribe" class="m-t-2" placeholder="请输入文章简要" size="large"></el-input>
        <el-select v-model="choicescate" class="m-y-2" placeholder="选择分类">
            <el-option v-for="item in cates" :key="item.value" :label="item.value" size="large" :value="item.value" />
        </el-select>
    </div>
    <Editor height="30rem" v-model="context" ref="editor" class="editor"></Editor>
    <el-button type="info" size="large" class="m-t-2" @click="upload">确定</el-button>
</template>

<!------------------------------>

<script setup lang="ts">
import Editor from '../../components/markdownEditor.vue'
const global=getCurrentInstance()

//Flag:绑定md文档的数据

//Flag:初始赋值
let editor = ref()

//BUG:解决获取子组件实例的方法:定时器获取
setTimeout(() => {
    editor.value.setValue()
},100)

//Flag:获得的信息
let choicescate = ref()
let choicestitle = ref()
let context = ref()
let chiocedescribe =ref()


//Flag:获取分类数据
let cates = ref()
//API
global?.proxy?.$axios.get('v1/getcategories').then((res) => {
    cates.value = res?.data.data.map((item: any) => {
        return {
            value:item.categoryname
        }
    })
    console.log(cates.value)
})

//Flag:博客上传
const upload = () => {
    //API
    global?.proxy?.$axios.post('/v1/uploadarticle', {
        context: context.value,
        articlename:choicestitle.value,
        categoryname: choicescate.value,
        describe:chiocedescribe.value
    }).then((res :any) => {
        if (res?.data   .status == 200) {
            ElMessage.success({
                message: "上传成功!!",
                center:true
            })
            editor.value.setValue('')
            choicescate.value = null
            chiocedescribe.value =null
            choicestitle.value=''
        }
    })
}

</script>

<!------------------------------>

<style scoped lang="scss">




</style>